"use client";

import { Breadcrumb, Layout, Menu, theme } from "antd";
import { Button } from "antd";
const { Header, Content, Footer, Sider } = Layout;
import { navs } from "./const";
import styles from "./HeaderComponent.module.scss";
import Login from "@/components/Login";
import { useState } from "react";

const HeaderComponent = () => {
  const [isShowLogin, setIsShowLogin] = useState(false);
  const handleLoginClick = () => {
    setIsShowLogin(true);
  };
  const handleClose = () => {
    setIsShowLogin(false);
  };
  return (
    <Header style={{ display: "flex", alignItems: "center" }}>
      <div className={styles.logo} />
      <Menu
        theme="light"
        mode="horizontal"
        defaultSelectedKeys={["2"]}
        items={navs}
        style={{ flex: 1, minWidth: 0 }}
      />
      <div>
        <Button type="primary" onClick={handleLoginClick}>
          登录
        </Button>
      </div>
      <Login isShow={isShowLogin} onClose={handleClose} />
    </Header>
  );
};

export default HeaderComponent;
